import React, { Component } from "react";
import ReactSwipe from "react-swipe";

import './banner.scss'

export default class Banner extends Component {
  constructor(props) {
    super(props)
    this.state = {
      item: 0
    }
  }
  render() {
    let options = {
      continuous: false,
      disableScroll: false,
      stopPropagation: false
    };
    return (
      <div>
        <ReactSwipe className="carousel" swipeOptions={options}>
          <div className="pane">
              <div className="item"><img src="http://placehold.it/60x60"  alt=""/></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
              <div className="item"><img src="http://placehold.it/60x60" alt="" /></div>
          </div>
          <div className="pane">PANE 2</div>
          <div className="pane">PANE 3</div>
        </ReactSwipe>
      </div>
    );
  }
}
